@charset "utf-8";
$fontSize:100;
@function r($p){
    @return $p/$fontSize*1rem;
}
html{
    font-size: $fontSize*1px;
}
$fontSizebody:13px;
body{
    font-size: $fontSizebody;
} 
  


//中部公共部分
.middle{
    width: 100%;
    background: #f5f5f5;
    font-size: 0;
    //加载更多
    .loadmore{
        color: #bbbbbb;
        text-align: center;
        padding: r(18) 0;
        font-size: $fontSizebody;}
    //大图
    .m_pic>img{width:100%;
        margin: r(7) 0;
}
    //GIMC导航栏
    .m_nav{
        width: 100%;
        display: flex;
        justify-content: space-around;
        border-bottom: 1px solid #dfdfdf;
        margin-bottom: r(20);
        >li{width: 33.33%;
            height: r(89);
            display: flex;
            align-items: center;
            justify-content: center;
            >a{color: #8b8b8b;
            font-size: $fontSizebody;}
        }
        >li:first-child{>a{color: white}
            background: #b20000;}
    }
    //白色背景盒子
    .whitebox{
        width: 100%;
        background: white;
        padding:r(28) r(28) 0 r(28);
        box-sizing: border-box;
        //文章内容
        >div:nth-child(1)>p{
            width: 100%;
            color: #8b8b8b;
            font-size:$fontSizebody;
            text-indent: 2em;
            padding-bottom: 12px;
            text-align: justify;
        }
        >div:nth-child(1){
            border-bottom:1px solid #dddddd;}
        //图片
        .m_video>video{width: 100%;
            padding: r(39) 0 r(32);}
        //白色背景盒子
        .develop{
            width: 100%;
            font-size: $fontSizebody;
            //红色标题
            .dvlp_red{
                height: r(81);
                background: #b20000;
                position: relative;
                >div:nth-child(1)>img{
                    width: r(42);
                    left:r(24);}
                >div:nth-child(3)>img{
                    width: r(42);
                    right: r(24);}
                >p{left: r(92);
                    height: $fontSizebody;
                    color: white;
                    line-height: $fontSizebody;}
               //居中
               >div:nth-child(1)>img,
               >div:nth-child(3)>img,
               >p{position: absolute;
                    top: 0;
                    bottom: 0;
                    margin: auto;}
            }
            //白色、灰色共有属性
            .dvlp{
                height: r(108);
                width:100%;
                display: flex;
                align-items: center;
                overflow: hidden;
                font-size: 0;
                .dvlp_l>img{width: r(35);
                    margin: 0 r(29);}
                .dvlp_r{
                    >p:nth-child(1){
                    font-size: $fontSizebody;
                    font-weight: bold;};
                    >p:nth-child(2){color: #b20000;
                    font-size: 10px;};
                }
            }
            //白色块
            .dvlp_white{background: transparent;}
            //灰色块
            .dvlp_gray{background: #f3f3f3;}
            //最后一个li的下分割线
            >li:last-of-type{
                border-bottom: 1px solid #dddddd;}
        } 
    }
}
